Weboldal JAVA Spring Boot alapokon - 6
Az előző részben eljutottunk a Controller rétegig, amely JAVA oldalról az utolsó lépés a view réteg, azaz a HTML oldali megjelenítés felé. Ezúttal a view réteggel foglalkozunk tehát, amely jelen esetben HTML+CSS oldalakat jelent, kiegészítve Thyemleaf-fel, amely HTML kódba könnyen integrálhatóvá teszi a JAVA kódhoz való kapcsolódást.
Komolyabban a HTML és CSS párosba nem fogunk belemélyedni, arról külön ódákat lehetne zengeni, koncentráljunk csak a Thyemleaf-re.A POM.XML-ben szerepelnie kell dependency-ként, hogy használni tudjuk, és ezzel túl is vagyunk a Thymeleaf beállításain. Nézzük meg példaként az index.html forráskódját. Ha a Kategóriák szekciót megnézzük, látható, hogy a honlap 6 fő kategóriájára (Tech, Data, Java, SQL, R, GIS) készült 1-1 terület, azaz div. Ha megnézzük mondjuk a JAVA kategóriáját, akkor találunk benne egy article th:each="story : ${java2}" sort. Ezzel azt mondjuk meg a HTML oldalnak, hogy story-ként nevezzük el azt a hivatkozást, amely a HomeController.java-ban a @RequestMapping("/") résznél a java2-re hivatkozik. Azaz, a div további részében a Controller rétegen keresztül meghívjuk a storyService.getFirstByCategoryName metódusát, és átadjuk neki a "java" argumentumot: model.addAttribute("java2", storyService.getFirstByCategoryName("java"));.
Ha megnézzük kicsit lejjebb a forráskódot, láthatjuk is, hogy a továbbiakban a story-ra való hivatkozás során elkérjük az adatbázistól a logo, posted, valamint a title String-jét: th:src="${story.logo}".
Még egy példa a megértésre: a Controller rétegben van a következő sor: model.addAttribute("countJava", storyService.getCountCategories("java")); . Ez meghívja a storyService.getCountCategories metódust, amely az adatbázisban megszámolja, hogy hány darab "java" bejegyzés szerepel az adatbázis Category mezőjében. Ezt az értéket aztán HTML oldalon megívjuk a következő módon: th:text="${countJava}, amit aztán a felhasználó a böngészőjében lát.
A végén még názzük meg azt is, hogy miképpen tudunk form felületet kialakítani, amelyen keresztül az adatbázisba tudunk írni. Ezt a createposts.html oldalon láthatjuk, ahol a form-nak megadjuk, hogy amikor a felhasználó rákattint a submit gombra, akkor a Controller rétegben lévő @PostMapping("/create")-ben lévő eljárást hívja meg (ami jelen esetben elmenti az adatbázisba a formon felvitt adatokat). A html oldali parancs erre: th:action="@{/create}". Itt adjuk meg továbbá, hogy melyik adatbázis táblába töltjük azokat: th:object="${story}". Az adatbázis tábla mezőit pedig a form mezőihez illesztjük: th:field="*{title}".
A folyamatnak tehát ennyi a lényege, nagyon egyszerűen használható, a JAVA-val könnyen összekapcsolható nyelvről beszélünk, amire mindnekit buzdítok, hogy nyugodtan használja munkái során.
